<template>
	<div class="app">
		<!-- 通过父组件给子组件传递函数类型的props实现：子给付传递数据 -->
		<h1>{{msg}}，学生姓名是:{{studentName}}</h1>
    <School :getSchoolName="getSchoolName"/>  
		<!-- 通过父组件给子组件绑定一个自定义事件实现：子给付传递数据 -->
		<Student v-on:atguigu="getStudentName"/>

		<Student ref="student"/>
	</div>
</template>

<script>
	import Student from './components/Student'
	import School from './components/School'

	export default {
		name:'App',
		components:{School,Student},
		data() {
			return {
				msg:'你好啊！',
				studentName:''
			}
		},
		methods:{
			getSchoolName(name){
				console.log('App收到了学校名',name);
			},
			getStudentName(name){
				console.log('App收到了学生名!',name)
			}
		},
		mounted(){
			this.$refs.student
		}
	}
</script>

<style scoped>
	.app{
		background-color: gray;
		padding: 5px;
	}
</style>
